import React, { Suspense } from 'react';
import logo from './logo.svg';
import './App.css';
import { BrowserRouter } from "react-router-dom"
import routerConfig from "./router/routerConfig"
import RouterView from './router/RouterView';
import { Provider } from "react-redux"
import store from "./store/index"
import Routes from "./router/routerConfig"
function App() {
  const children = () => <Routes />
  return (
    <div className="App">
      <Provider store={store}>
        <BrowserRouter>
          <Suspense fallback="加载中">
            {children()}
          </Suspense>
        </BrowserRouter>
      </Provider>

    </div>
  );
}

export default App;

// import {
//   MenuFoldOutlined,
//   MenuUnfoldOutlined,
//   UploadOutlined,
//   UserOutlined,
//   VideoCameraOutlined,
// } from '@ant-design/icons';
// import { Layout, Menu } from 'antd';
// import React, { useState } from 'react';
// // import {ROUTER} from "../../type/router.d"

// const { Header, Sider, Content } = Layout;

// interface PROPS{
//   // routerConfig:ROUTER
// }
// const App: React.FC = (props:PROPS) => {
//   const [collapsed, setCollapsed] = useState(false);

//   return (
//     <Layout>
//       <Sider trigger={null} collapsible collapsed={collapsed}>
//         <div className="logo" />
//         <Menu
//           theme="dark"
//           mode="inline"
//           defaultSelectedKeys={['1']}
//           items={[
//             {
//               key: '1',
//               icon: <UserOutlined />,
//               label: 'nav 1',
//             },
//             {
//               key: '2',
//               icon: <VideoCameraOutlined />,
//               label: 'nav 2',
//             },
//             {
//               key: '3',
//               icon: <UploadOutlined />,
//               label: 'nav 3',
//             },
//           ]}
//         />
//       </Sider>
//       <Layout className="site-layout">
//         <Header className="site-layout-background" style={{ padding: 0 }}>
//           {React.createElement(collapsed ? MenuUnfoldOutlined : MenuFoldOutlined, {
//             className: 'trigger',
//             onClick: () => setCollapsed(!collapsed),
//           })}
//         </Header>
//         <Content
//           className="site-layout-background"
//           style={{
//             margin: '24px 16px',
//             padding: 24,
//             minHeight: 280,
//           }}
//         >
//           Content
//         </Content>
//       </Layout>
//     </Layout>
//   );
// };

// export default App;
